/*px em rem等长度单位演示*/
html{
    font-size:62.5%;/*16px*0.625=10px*/
}
body{
    font-size:1em;
}
.value_px{
    font-size:31px;
}
.value_em{
    font-size:2em;
}
.value_rem{
    font-size:2rem;
}
/*颜色值*/
.color_name{
    color:red;
}
.color_hex{
    color:#00ff00;
}
.color_fun{
    color:rgb(21, 122, 223);
}
/*图片函数url*/
.img_url{
    width:1146px;
    height:294px;
    background-image: url("images/0.png");
    border: 1px solid;
    font-weight: bolder;
}
/*字体样式属性*/
.font_demo{
    /*font:400;*/
    color: red;
    font-family: 微软雅黑,sans-serif;/*字体种类*/
    font-size:2em;
    font-style:italic;/*字体样式 斜体*/
    font-weight: bold;/*加粗*/
}

/*常见文本样式属性*/
.text_demo{
    font-size:3em;
    border:1px solid black;
    width:30rem;
    height:10rem;
    text-align: center;
    line-height:10rem;
    text-decoration: underline;
    text-indent: 3rem;
    letter-spacing: 1rem;
}
/*列表样式属性*/
ul{
    font-size:2rem;
}
.list_demo1{
    list-style:circle inside;
}
.list_demo2{
    list-style:none;
}
.list_demo3{
    list-style-image:url(images/0.png);
    list-style-type: none;
    list-style-position: inside;
}
.iist_demo4{
    list-style:none url(images/0.png) inside;
}
/*背景样式属性*/
.bg_box{
    border:1px solid red;
    width:40rem;
    height: 20rem;
}
.bg_demo1{
    background-color: coral;
}
.bg_demo2{
    background-image: url(images/0.png);
}
.bg_demo3{
    background-repeat: no-repeat;
    background-image: url(images/0.png);
}
.bg_demo4{
    background-image: url(images/0.png);
    background-repeat: no-repeat;
    background-position:0 20;
}
.bg_demo5{
    background-image: url(images/0.png);
    background-repeat: no-repeat;
    background-position: top right;
    background-attachment: scroll;
}
.bg_demo6{
    background: #00ff00 url(images/0.png) no-repeat top right fixed;
}

/*表单样式*/
.form_demo{
    font-size:2rem;
    border:1px solid seagreen;
    background-color: #fff;
    width:30rem;
    height:25rem;
    text-align: center;
}

.form.demo input[type="text"],.form.demo input[type="password"]{
    border-left:0;
    border-right: 0;
    border-top:0;
    border-bottom:1px solid #000;
    width:200px;
    height:39px;
    padding-left:39px;
}

.form_demo #usrname{
    background:white url(usename.png) no-repeat top left; 
    height:39px;
    border:1px solid black;
}

.form_demo #pwd{
    background:white url(pwd.png) no-repeat top left;
}
.form_demo [type="submit"]{
    width:100px;
    height:38px;
    background-color: red;
    border:1px dashed rgb(58, 20, 229);
    border-radius:10px;
    color:white;
}